<template>
    <div>
        <input type="text" v-model="keyWord">
        <h3>{{ keyWord }}</h3>
    </div>
</template>

<script setup>
import { ref, customRef } from 'vue'
function useThrottledRef(value, delay = 200) {
    let lastTriggerTime = 0
    return customRef((track, trigger) => {
        return {
            get() {
                track()
                return value
            },
            set(newValue) {
                const now = Date.now()
                if (now - lastTriggerTime >= delay) {
                    value = newValue
                    lastTriggerTime = now
                    trigger()
                }
            }
        }
    })
}
let keyWord = useThrottledRef('hello', 1000)

</script>